/* The sidebar menu */
.sidebarx {
    /* 100% Full-height */
    height: 100%;
    width: 0; /* 0 width - change this with JavaScript */
    /* Stay in place */
    position: fixed;

    /* position: sticky; */

    /* Stay on top */
    /* top: 0; */
    right: 0;
    /* bottom: 20px; */

    /* z-index: 0; */

    /* Disable horizontal scroll */
    /* overflow-x: hidden; */
    overflow: scroll;

    /* Place content 60px from the top */
    /* margin-top: 80px; */
    /* margin-bottom: 100px; */

    transition: 0.5s; /* 0.5 second transition effect to slide in the sidebar */
    /* background-color: red; */
}

.mainx {
    /* Style page content - use this if you want to push the page content to the right when you open the side navigation */
    transition: margin-right 0.5s; /* If you want a transition effect */
}

/* When you mouse over the navigation links, change their color */
.sidebarx a:hover {
    color: #f1f1f1;
}

.sidenav-toggled {
    width: 30em;
}

.mainx-toggled {
    margin-right: 30em;
}

#sidebar-container {
    margin-bottom: 20em;
}

#sidebar-dataTable {
    font-size: 12px;
}

/* On smaller screens, where height is less than 450px, change the style of the sidenav (less padding and a smaller font size) */
@media screen and (max-width: 600px) {
    /* .sidebarx {padding-top: 15px;} */
    .sidebarx a {font-size: 10px;}
    #sidebar-dataTable {font-size: 10px;}
    .vessel-image-sidebar {
        width: 30px;
        height: 30px;
    }
    .sidenav-toggled {width: 15em;}
    .mainx-toggled {margin-right: 15em;}
}

.pull-left{
    float:left!important;
}

#loc-search-input {
    width: 20em;
    margin: 10px 10px 10px 0;
    height: 2em;
    padding: 1em;
}